<style>
    .red {
        color: red;
    }

    .switch {
        width: 28px;
        height: 14px;
    }

    .switch small {
        width: 14px;
        height: 14px;
    }

    .switch.checked small {
        left: 13px;
    }

    .dropdown-menu {
        max-height: 303px;
    }

    .checkError {
        background-color: #CCFFFF;
    }

    .checkSuccess {
        background-color: #FFFFFF;
    }
</style>
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <form name="myForm" novalidate>
                    <div class="box-header">

                        <h1>项目创建向导</h1>
                        <div style="font-size: 20px;">
                            <span>步骤</span>
                            <span style="padding-left: 35px;"
                                  ng-class="{true:'red',false:''}[info.index == '1']">1</span>
                            <span style="padding-left: 35px;"
                                  ng-class="{true:'red',false:''}[info.index == '2']">2</span>
                            <span style="padding-left: 35px;"
                                  ng-class="{true:'red',false:''}[info.index == '3']">3</span>
                            <span style="padding-left: 35px;"
                                  ng-class="{true:'red',false:''}[info.index == '4']">4</span>
                            <span style="padding-left: 35px;"
                                  ng-class="{true:'red',false:''}[info.index == '5']">5</span>
                        </div>
                    </div>
                    <div class="box-body" style="margin-top:1px;">
                        <table width="60%" style="font-size: 15px;">
                        </table>
                        <br>
                        <div ng-show="info.index == '1'" style="width: 60%;">

                            <input type="radio" value="0" name="planType" ng-model="info.planType"/>&nbsp;&nbsp;禅道项目
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                            <input type="radio" value="1" name="planType" ng-model="info.planType"/>&nbsp;&nbsp;紧急项目
                            <br>
                            <span style="color: red;">1.在禅道上创建完项目后,选择"禅道项目"可导入</span>
                            <br>
                            <span style="color: red;">2.当需要紧急发版时,可创建"紧急项目"</span>
                            <br>
                            <br>
                            <div ng-if="info.planType ==  '0'">
                                <uib-accordion close-others="false">
                                    <uib-accordion-group heading="禅道项目" is-open="true">
                                        <table>
                                            <tbody>
                                            <tr>
                                                <p><input type="text" ng-model="info.PlanInfoByUrl" style="width: 60%"
                                                          placeholder="请输入禅道项目号,url或者编码">
                                                    <button ng-click="queryUrl()">查询</button>
                                                    <span ng-show="info.PlanInfo.isIdExist"
                                                          style="color: red;">项目代号已经存在</span>
                                                </p>
                                            </tr>
                                            <tr style="height: 70px;">
                                                <td> 项目名:</td>
                                                <td>
                                                    {{info.PlanInfo.name}}
                                                </td>
                                            </tr>

                                            <tr style="height: 70px;">
                                                <td>开始/结束日期：</td>
                                                <td>
                                                    {{info.PlanInfo.begin}}/{{info.PlanInfo.end}}
                                                </td>
                                            </tr>

                                            <tr style="height: 70px;">
                                                <td>人员：</td>
                                                <td>
                                                    {{info.realnames}}
                                                </td>
                                            </tr>
                                            <tr style="height: 70px;">
                                                <td>项目负责人：</td>
                                                <td>
                                                    {{info.PlanInfo.PM_name}}
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>集成日期:</td>
                                                <td>
                                                    <p class="input-group" style="width: 384px;">
                                                        <input clear-text="清除" close-text="关闭" current-text="今天"
                                                               ng-readonly="true"
                                                               type="text" class="form-control" uib-datepicker-popup
                                                               ng-model="info.integration_date"
                                                               is-open="integration_date"
                                                               ng-required="true" close-text="Close"
                                                               ng-change="updateIntegrationDate()"/>
                                                        <span class="input-group-btn">
                                                    <button type="button" class="btn btn-default"
                                                            ng-click="integration_date=!integration_date"><i
                                                            class="glyphicon glyphicon-calendar"></i></button>
                                                    </span>
                                                    </p>
                                                    <span ng-show="info.integrationLock" style="color: red">{{info.integrationMsg}}</span>
                                                </td>

                                            </tr>
                                            <tr>
                                                <td>上线日期:</td>
                                                <td>
                                                    <p class="input-group" style="width: 384px;">
                                                        <input clear-text="清除" close-text="关闭" current-text="今天"
                                                               ng-readonly="true"
                                                               type="text" class="form-control" uib-datepicker-popup
                                                               ng-model="info.online_date" is-open="online_date"
                                                               ng-required="true" close-text="Close"
                                                               ng-change="updateOnlineDate()"/>
                                                        <span class="input-group-btn">
                                                    <button type="button" class="btn btn-default"
                                                            ng-click="online_date=!online_date"><i
                                                            class="glyphicon glyphicon-calendar"></i></button>
                                                    </span>
                                                    </p>
                                                    <span ng-show="info.online_dateLock" style="color: red">{{info.online_dateMsg}}</span>
                                                </td>

                                            </tr>
                                            </tbody>
                                        </table>
                                    </uib-accordion-group>
                                </uib-accordion>
                            </div>
                            <div ng-if="info.planType ==  '1'">
                                <uib-accordion close-others="false">
                                    <uib-accordion-group heading="紧急项目" is-open="true">
                                        <table>
                                            <tr style="height: 70px;">
                                                <td>项目名(必填):</td>
                                                <td>
                                                    <input type="text" ng-model="info.PlanInfo.name"
                                                           placeholder="请输入项目名称"/>
                                                </td>
                                            </tr>
                                            <tr style="height: 70px;">
                                                <td>描述(必填):</td>
                                                <td>
                                                    <textarea wrap="off" style="overflow-y:scroll;width: 80%;"
                                                              placeholder="紧急上线描述信息"
                                                              ng-model="info.emergencyDesc" rows="2"></textarea>
                                                </td>
                                            </tr>
                                            <tr style="height: 70px;">
                                                <td>bug号(与紧急需求号二选一,必填一个):</td>
                                                <td>
                                                    <input type="text" ng-model="info.bug_num"
                                                           placeholder="请输入解决的bug号"/>
                                                </td>
                                            </tr>
                                            <tr style="height: 70px;">
                                                <td>紧急需求号(与bug号二选一,必填一个):</td>
                                                <td>
                                                    <input type="text" ng-model="info.need_num" placeholder="请输入需求号"/>
                                                </td>
                                            </tr>
                                            <tr style="height: 70px;">
                                                <td>测试负责人(必选):</td>
                                                <td>
                                                    <input type="text" ng-model="info.testUserInfo"
                                                           uib-typeahead="user as user.realname for user in info.testUserList | filter:{realname:$viewValue}|limitTo:15"
                                                           typeahead-template-url="selectTemplate.html"
                                                           class="form-control" typeahead-show-hint="true"
                                                           typeahead-min-length="0" typeahead-select-on-blur="true">
                                                </td>
                                            </tr>
                                            <tr style="height: 70px;">
                                                <td>上线日期(必选):</td>
                                                <td>
                                                    <p class="input-group" style="width: 384px;">
                                                        <input clear-text="清除" close-text="关闭" current-text="今天"
                                                               ng-readonly="true"
                                                               type="text" class="form-control" uib-datepicker-popup
                                                               ng-model="info.online_date" is-open="online_date"
                                                               ng-required="true" show-button-bar="false"
                                                               datepicker-options="dateOptions"/>
                                                        <span class="input-group-btn">
                                                        <button type="button" class="btn btn-default"
                                                                ng-click="online_date=!online_date"><i
                                                                class="glyphicon glyphicon-calendar"></i></button>
                                                        </span>
                                                    </p>
                                                </td>
                                            </tr>
                                        </table>
                                    </uib-accordion-group>
                                </uib-accordion>
                            </div>
                        </div>
                        <div ng-show="info.index == '2'" style="width: 90%;">
                            <table width="100%">
                                <tbody>
                                <tr><label><h4>请选择项目包含的工程</h4></label></tr>
                                <tr style="height: 70px;">
                                    <td>
                                        <p style="display: inline-block; width: 25%;"
                                           ng-repeat="i in info.getTrunkProjectList.jarProject">
                                            <switch data-ng-model="i.istrue"></switch>
                                            <b>{{i.project_name}}</b>
                                        </p>
                                        <hr style="height:1px;border:none;border-top:1px solid #555555;"/>
                                    </td>
                                </tr>
                                <tr style="height: 70px;">
                                    <td>
                                        <input type="search" ng-model="search.project_name" style="width: 220px;"
                                               placeholder="Search Project Name Here..."/>
                                        <br>
                                        <br>
                                        <p style="display: inline-block; width: 25%;"
                                           ng-repeat="i in info.getTrunkProjectList.trunkProject | filter:search">
                                            <switch data-ng-model="i.istrue"></switch>
                                            <b>{{i.project_name}}</b>
                                        </p>
                                    </td>
                                </tr>
                                </tbody>
                            </table>

                        </div>
                        <div ng-show="info.index == '3'" style="width: 70%;">
                            <table>
                                <tbody>
                                <tr><label>规划工程分支,以字母开头,可以包括字母、数字、下划线,长度15</label></tr>
                                <tr style="height: 70px;">
                                    <td>项目代号:</td>
                                    <td>
                                        <input type="text" ng-model="info.checkplan_code" placeholder="请输入项目代号，字符不超过15"
                                               maxlength="15" ng-change="testCode()">
                                        <button ng-click="checkProjectPlanCode()" ng-disabled="info.codeMsg!=''">校验
                                        </button>
                                        <span ng-show="info.codeMsg!=''" style="color: red">{{info.codeMsg}}</span>
                                        <span ng-show="msg!=null" style="color: red">{{msg}}</span>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                            <table class="table table-bordered">
                                <thead>
                                <tr>
                                    <th width="5%">工程</th>
                                    <th width="5%">来源</th>
                                    <th width="10%">目标分支</th>
                                    <th width="10%">版本号</th>
                                    <th width="5%">手动管理</th>
                                    <th width="10%"></th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr class="item" ng-repeat="i in info.ProjectDefaultNameList"
                                    ng-class="{true: 'checkError', false: ''}[i.msg!=''&& i.msg!=undefined]">
                                    <td>{{i.trunk_name}}</td>
                                    <td ng-hide="i.modifiable">{{i.svn_from}}</td>
                                    <td ng-show="i.modifiable">
                                        <select ng-model="i.svn_from">
                                            <option value="{{s.name}}" ng-repeat="s in i.svn_list">
                                                {{s.name}}
                                            </option>
                                        </select>
                                    </td>
                                    <td><span ng-hide='vcs_path(i)'></span>{{i.vcs_path}}</td>
                                    <td ng-hide="i.modifiable">{{i.branch_num}}</td>

                                    <td ng-show="i.modifiable">
                                        <input ng-model="i.branch_num"
                                               style="width: 160px; height:28px;" ng-change="branch_num(i)"></td>
                                    <td ng-hide="i.modifiable"><i class="glyphicon glyphicon-lock"
                                                                  ng-click="edit(i)"></i>
                                    </td>
                                    <td ng-show="i.modifiable"><i ng-hide="i.branch_numMsg.length>0"
                                                                  class="glyphicon glyphicon-floppy-saved"
                                                                  ng-click="edit(i)"></i>
                                    </td>
                                    <td>
                                        <p>
                                            <span ng-show="i.branch_numMsg.length>0" style="color: red">{{i.branch_numMsg}}</span>
                                        </p>
                                        <span style="color: red"><b>{{i.msg}}</b></span>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>

                        <div ng-show="info.index == '4'" style="width: 60%;">
                            <uib-accordion close-others="false">
                                <uib-accordion-group heading="uCloud规格" is-open="true">
                                    <table class="table table-bordered">
                                        <thead>
                                        <tr>
                                            <th width="5%">UC型号</th>
                                            <th width="5%">UC规模</th>
                                            <th width="10%">环境特性</th>
                                            <th width="5%">CPU</th>
                                            <th width="5%">内存</th>
                                            <th width="5%">硬盘</th>
                                            <th width="5%">可用UC数量</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr ng-repeat="l in info.load_level" style="height: 40px;">
                                            <td>{{l.level_name}}</td>
                                            <td>{{l.scale}}</td>
                                            <td>{{l.desc}}</td>
                                            <td>{{l.cpus}}</td>
                                            <td>{{l.ram}}</td>
                                            <td>{{l.disks}}</td>
                                            <td>{{l.mun}}</td>
                                        </tr>
                                        </tbody>
                                    </table>

                                </uib-accordion-group>

                                <uib-accordion-group heading="申请uCloud环境" is-open="true">
                                    <table>
                                        <tbody>
                                        <tr style="height: 70px;">
                                            <td style="width: 150px;"> uCloud :</td>
                                            <td>

                                                <switch data-ng-model="info.DEV"></switch>
                                                DEV
                                                <switch data-ng-model="info.QA"></switch>
                                                QA
                                                <switch data-ng-model="info.UAT"></switch>
                                                UAT

                                                <br>

                                        </tr>
                                        <tr style="height: 70px;">
                                            <td style="width: 150px;">延用老环境 :</td>
                                            <td>
                                                <switch data-ng-model="info.useOldEnv"></switch>

                                                <span style="color: cornflowerblue;">延用上一期项目的环境，如果刷环境，建议用新的。如果不刷环境，可重复使用</span>

                                            </td>
                                        </tr>

                                        <tr style="height: 70px;">
                                            <td style="width: 150px;">外网权限 :</td>
                                            <td>
                                                <switch data-ng-model="info.isUseWeb"></switch>
                                                <input style="height: 30px;" type="" ng-model="info.useWebDesc"
                                                       ng-show="info.isUseWeb" placeholder="请输入描述!" name="">

                                                <span ng-show="info.isUseWeb" style="color: red">请到oa发申请
                                            <a href="javascript:void(0)" ng-click="goOa()">
                                            <span class="glyphicon glyphicon-envelope"></span>
                                            </a>
                                            </span>

                                            </td>
                                        </tr>


                                        <tr style="height: 70px;">
                                            <td style="width: 150px;">回收日期</td>
                                            <td>
                                                <p class="input-group">
                                                    <input ng-readonly="true" type="text" class="form-control"
                                                           uib-datepicker-popup
                                                           ng-model="info.expect_recover_date"
                                                           is-open="endExceptTimeOpened"
                                                           ng-required="true" show-button-bar="false"
                                                           datepicker-options="dateOptions"/>
                                                    <span class="input-group-btn">
                                                    <button type="button" class="btn btn-default"
                                                            ng-click="endExceptTimeOpened=!endExceptTimeOpened"><i
                                                            class="glyphicon glyphicon-calendar"></i></button>
                                                    </span>
                                                </p>
                                            </td>
                                        </tr>

                                        <tr style="height: 70px;">
                                            <td style="width: 150px;">环境：</td>
                                            <td>
                                                <div class="row">
                                                    <div class="col-md-5">
                                                        <ui-select multiple ng-model="info.zones" theme="bootstrap"
                                                                   close-on-select="false" style="width: 300px;"
                                                                   title="Choose a color">
                                                            <ui-select-match placeholder="Select colors...">
                                                                {{$item.zone_title}}
                                                            </ui-select-match>
                                                            <ui-select-choices
                                                                    repeat="i in info.ZoneList | filter:$select.search|limitTo:15">
                                                                {{i.zone_title}}
                                                            </ui-select-choices>
                                                        </ui-select>
                                                    </div>
                                                </div>
                                            </td>


                                        </tr>
                                        <tr style="height: 70px;">
                                            <td style="width: 150px;">申请人：</td>
                                            <td>
                                                {{info.userName}}
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </uib-accordion-group>
                            </uib-accordion>
                        </div>
                        <br>
                        <div ng-show="info.index == '5'" style="width: 60%;">
                            <label>
                                <h3>信息收集完毕</h3>
                            </label>
                            <table width="95%" ng-if="info.planType ==  '0'">
                                <tbody>
                                <tr style="height: 70px;">
                                    <td><b>项目名:</b>{{info.PlanInfo.name}}</td>
                                    <td><b>开始日期:</b>{{info.PlanInfo.begin}}</td>
                                    <td><b>集成日期:</b>{{info.integration_date |date:'yyyy-MM-dd'}}</td>
                                    <td><b>上线日期:</b>{{info.online_date |date:'yyyy-MM-dd'}}</td>
                                </tr>
                                <tr style="height: 70px;">
                                    <td colspan="4">项目代号:{{info.checkplan_code}}</td>
                                </tr>
                                <tr style="height: 70px;">
                                    <td colspan="4">项目负责人:{{info.PlanInfo.PM_name}}</td>
                                </tr>
                                <tr style="height: 70px;">
                                    <td colspan="4">
                                        人员列表: {{info.realnames}}
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                            <table width="95%" ng-if="info.planType ==  '1'">
                                <tbody>
                                <tr style="height: 70px;">
                                    <td><b>项目名:&nbsp;&nbsp;&nbsp;</b>{{info.PlanInfo.name}}</td>
                                </tr>
                                <tr style="height: 70px;">
                                    <td><b>上线日期:&nbsp;&nbsp;&nbsp;</b>{{info.online_date |date:'yyyy-MM-dd'}}</td>
                                </tr>
                                <tr style="height: 70px;">
                                    <td><b>项目代号:&nbsp;&nbsp;&nbsp;</b>{{info.checkplan_code}}</td>
                                </tr>
                                <tr style="height: 70px;">
                                    <td><b>项目负责人:&nbsp;&nbsp;&nbsp;</b>{{info.userName}}</td>
                                </tr>
                                </tbody>
                            </table>
                            <label><h3>工程列表</h3></label>
                            <table class="table table-bordered">
                                <thead>
                                <tr>
                                    <th width="5%">工程</th>
                                    <th width="10%">来源</th>
                                    <th width="5%">目标分支</th>
                                    <th width="5%">版本号</th>

                                </tr>
                                </thead>
                                <tbody>
                                <tr class="item" ng-repeat="i in info.ProjectDefaultNameList">
                                    <td>{{i.trunk_name}}</td>
                                    <td>{{i.svn_from}}</td>
                                    <td>{{i.vcs_path}}</td>
                                    <td>{{i.branch_num}}</td>

                                </tr>
                                </tbody>
                            </table>
                            <tr>申请虚拟机：{{info.titles}}</tr>
                        </div>
                        <br>
                        <div style="width: 60%;">
                            <button ng-disabled="info.index == '1' " style="margin-left: 10%;" class="btn btn-default"
                                    data-ng-click="previousBtn();">Previous
                            </button>
                            <button ng-show="info.index != '5'" style="float: right;margin-right: 10%;"
                                    class="btn btn-default" data-ng-click="nextBtn();"
                                    ng-disabled="info.nextLock || info.branch_numLock">Next
                            </button>
                            <button ng-show="info.index == '5'" style="float: right;margin-right: 10%;"
                                    class="btn btn-default" data-ng-click="goInit();">完成
                            </button>

                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</section>
<script type="text/ng-template" id="subProject.html">
    <div>
        <br>
        <h4 class="text-left">
            &nbsp;&nbsp;信息收集完毕，准备创建项目
        </h4>
        <h4>
            *未填写部分，可以在项目列表继续维护
        </h4>
        <h4 class="text-left">
            <input type="checkbox" checked="checked" disabled>
            立即创建分支工程
        </h4>
        </span>
    </div>
    <div class="modal-footer">
        <button class="btn btn-warning" type="button" ng-click="save()">Save</button>
        <button class="btn btn-warning" type="button" ng-click="cancel()">Cancel</button>
    </div>
</script>
